<template>
  <div class="illegal" style="height:100%">
    <!-- <vue-better-scroll
      class="wrapper"
      ref="scrollqq"
      :scrollbar="scrollbarObj"
      :pullDownRefresh="pullDownRefreshObj"
      :pullUpLoad="pullUpLoadObj"
      :startY='parseInt(startY)'
      @pullingUp="onPullingUp"
    > -->
        <!-- 主要内容 -->
        <div class="headerBox">
            <div class="header">
                <x-icon type="ios-arrow-left" size="" class="icon-white" @click="goBack"></x-icon>
                待验收违章
            </div>
        </div>
        <div class="form-section" style="margin-top: 40px;">
            <ul class="top clearfix">
               <li v-for="(item,index) in ulLi" :key="index" @click="btnLi(index)" :class="index==ind?'currentLi':'aa'">{{item.name}} </li> 
            </ul>
            <!-- 全部 -->
            <div v-if="ind==0">
                <div class="form-item form-item-style1" @click="getCompany(0)">
                    <div class="label-title">
                    <label>被考核单位</label>
                    </div>
                    <div class="input_div">
                        <input type="text"
                                v-model="project"
                                :disabled="isDisabled">
                        <!-- <input type="hidden" v-model="params.checkDepartId"> -->
                        <x-icon type="ios-arrow-right" size="22" class="icon-right" ></x-icon>
                    </div>
                </div>
                <div class="form-item form-item-style1">
                    <div class="label-title">
                    <label>查询开始时间</label>
                    </div>
                    <group>
                        <datetime v-model="star"></datetime>
                    </group>
                </div>
                <div class="form-item form-item-style1">
                    <div class="label-title">
                        <label>查询结束时间</label>
                    </div>
                    <group>
                         <datetime v-model="end"></datetime>
                    </group>
                </div>
                <h1 class="search">
                    <div class="searchBtn" @click="search">查询全部数据</div>
                </h1>
                <p class="search-num">待验收 : {{totalCount}} 个</p>
                <!-- 查询结果区 -->
                <ul class="project_list">
                    <li v-for="(items,index) in resultlist" :key="index" @click="$router.push({path:'./acceptanceDetails',query:{id:items.id}})" v-show="nodata">
                       <div style="width:60px;height:60px;float:left;">
                          <img :src="items.weizurl" alt="" />
                        </div>
                        <h4>{{items.weizPhenItemListName}}</h4>
                        <p class="project_status">
                            <strong v-if="items.status==1">【待整改】</strong>
                            <strong v-if="items.status==2">【待验收】</strong>
                            <strong v-if="items.status==3">【已完成】</strong>
                        </p>
                        <p class="timeP"><span class="rightSpan">{{items.weizDate |time}}</span></p>
                        <div><x-icon type="ios-arrow-right" size="22" class="icon-right"></x-icon></div>
                    </li>
                    <li style="border:none" v-if="!nodata">暂无数据...</li>
                </ul>
            </div>
            <!-- 我的 -->
             <div v-if="ind==1">
                <div class="form-item form-item-style1" @click="getCompany(1)">
                    <div class="label-title">
                    <label>被考核单位</label>
                    </div>
                    <div class="input_div">
                    <input type="text"
                            v-model="project2"
                            :disabled="isDisabled">
                    <!-- <input type="hidden" v-model="params.checkDepartId"> -->
                    <x-icon type="ios-arrow-right" size="22" class="icon-right" ></x-icon>
                    </div>
                </div>
                <div class="form-item form-item-style1">
                    <div class="label-title">
                    <label>查询开始时间</label>
                    </div>
                    <group>
                    <datetime v-model="star2"></datetime>
                    </group>
                </div>
                <div class="form-item form-item-style1">
                    <div class="label-title">
                    <label>查询结束时间</label>
                    </div>
                    <group>
                    <datetime v-model="end2"></datetime>
                    </group>
                </div>
                <h1 class="search">
                    <div class="searchBtn" @click="search2">查询我的数据</div>
                </h1>
                <p class="search-num">待验收 : {{totalCount2}} 个</p>
                <!-- 查询结果区 -->
                <ul class="project_list">
                    <li v-for="(items,index) in resultlist2" :key="index" @click="$router.push({path:'./acceptanceDetails2',query:{id:items.id}})">
                        <div style="width:60px;height:60px;float:left;">
                          <img :src="items.weizurl" alt="" />
                        </div>
                        <h4>{{items.weizPhenItemListName}}</h4>
                        <strong v-if="items.status==1">【待整改】</strong>
                        <strong v-if="items.status==2">【待验收】</strong>
                        <strong v-if="items.status==3">【已完成】</strong>
                        <p class="timeP"><span class="rightSpan">{{items.weizDate |time}}</span></p>
                        <div><x-icon type="ios-arrow-right" size="22" class="icon-right"></x-icon></div>
                    </li>
                </ul>
            </div>
        </div>
            <!--classValue 显示隐藏   data树结构  nodeClicK节点点击返回值  name显示的字段  people -->
        <div v-transfer-dom>
            <popup v-model="classValue" width="100%">
            <ztree
                :data="data"
                @nodeClick="nodeClick"
                :name="'departName'"
              ></ztree>
            </popup>
        </div>
    <!-- </vue-better-scroll> -->
  </div>
</template>
<script>
  import ztree from "@commonComponents/tree"
  import formatDate from "../../utils/formatDate"
  import VueBetterScroll from "vue2-better-scroll"
  import { XHeader,Tabbar, TabbarItem, Group, Cell ,TransferDom, Popup} from 'vux'
  export default {
    data () {
      return {
        /*下拉刷新*/
        scrollbarObj:{fade:true},
        pullDownRefreshObj:false,
        pullUpLoadObj:{
           threshold:0,
           txt:{
             more:"加载更多",
             noMore:"没有更多数据了"
           }
        },
        startY:0,
        scrollToX:0,
        scrollToY:0,
        scrollToTime:700,
        isDisabled: true, // 是否禁止输入
        detailData: {
          DeptName:''
        },
        // 全部
        resultlist:[],
        project:'',
        star:new Date().getFullYear()+"-01-01",
        end:formatDate(new Date(),'yyyy-MM-dd'),
        params:{
            isall:1, // 1 全部 ,0 个人
            status:2, // 待验收
            departId:'',
            weizDateStart:'',
            weizDateEnd:'',
            skipCount:0,
            maxResultCount:1000,
        },
        totalCount:0,
    // 我的
        resultlist2:[],
        project2:'',
        star2:new Date().getFullYear()+"-01-01",
        end2:formatDate(new Date(),'yyyy-MM-dd'),
        params2:{
            isall:0, // 1 全部 ,0 个人
            status:2, // 待验收
            departId:'',
            weizDateStart:'',
            weizDateEnd:'',
            skipCount:0,
            maxResultCount:1000,
        },
        totalCount2:0,
        tableType:[{
          quantizeName:"",
          id:"",
          children:{
            quantizeName:"",
            id:"",
          }
        }],
        classValue:false,
        data:[],
        ulLi:[{name:'全部'},{name:'我的'}],
        ind:0,
        num:0,
        nodata:true,
        nodata2:true,
      }
    },
    components: {
      ztree,Popup,VueBetterScroll
    },
    directives:{
        TransferDom
    },
    mounted(){
        let that = this;
        this.$bridge.registerHandler("setToken", function(data) {
                         that.$store.state.Authorization =
          "Bearer " + data;
            var s = window.location.href
            if (s.indexOf('activeIndex')!=-1){
                that.ind=window.location.href.split('=')[1]
            }
            that.getData()
            that.getData2()
            that.getTableTypeList()
            //这里data ioS返回的是token值(字符串)
        });

        this.connectWebViewJavascriptBridge(function(bridge) {
            bridge.init(function(message, responseCallback) {});
            
            bridge.registerHandler("setToken", function(data) {
                             that.$store.state.Authorization =
          "Bearer " + data;
            var s = window.location.href
            if (s.indexOf('activeIndex')!=-1){
                that.ind=window.location.href.split('=')[1]
            }
            that.getData()
            that.getData2()
            that.getTableTypeList()
                  //这里data android返回的是token值(字符串)
                
            });
        });
    },
    created () {
      // 接收APP传来的数据
      var s = window.location.href
      if (s.indexOf('activeIndex')!=-1){
        this.ind=window.location.href.split('=')[1]
      }
      this.getData()
      this.getData2()
      this.getTableTypeList()
    },
    filters:{
      time(val){
        if (val){
            return val.substr(0,10)
        }
      }
    },
    methods: {
        connectWebViewJavascriptBridge(callback) {
            if (window.WebViewJavascriptBridge) {
                callback(WebViewJavascriptBridge);
            } else {
                document.addEventListener(
                "WebViewJavascriptBridgeReady",
                function() {
                    callback(WebViewJavascriptBridge);
                },
                false
                );
            }
        },  
      // 点击全部-我的
      btnLi(index){
          this.ind=index
      },
      onPullingUp(){
        let limitcount=this.resultlist.length;
        this.params.skipCount=limitcount;
        this.getData()
        this.getData2()
      },
      // 单位弹窗
      getCompany(num){
        this.num=num
        this.examinedUnits()
      },
      // 点击单位树
      nodeClick(item){
        if (this.num==0){
            this.params.departId=item.id
            this.project=item.departName
        }
        if (this.num==1){
            this.params2.departId=item.id
            this.project2=item.departName
        }
        this.classValue=false
        // if(item.departType==6||item.departType==7||item.departType==8){
        //   this.detailData.DeptName=item.departName
        //   this.params.checkDepartId=item.id
        //   this.classValue=false
        // }else{
        //   alert("只能选择项目部")
        //   /*this.$vux.toast.text("只能选择项目部")*/
        //   }
      },
      getTableTypeList(){
        this.$axiosAjax.getTableTypeList({parentId:"0"}).then((res) => {
          if(res.data.result.isSuccess==true){
            this.tableType=res.data.result.data
          }
        }).catch(
          (err)=>{

          }
        )
      },
      //   初始化数据 --全部
      getData(){
        this.params.weizDateStart=this.star+ ' 00:00:00'
        this.params.weizDateEnd=this.end+' 00:00:00'
        this.$axiosAjax.illegalGetAll(this.params).then((res) => {
         if(res.data.success){
            this.resultlist=res.data.result.items
            if (res.data.result.items.length<=0){
                this.nodata=true
            }
            this.totalCount= res.data.result.totalCount
          }
        }).catch((err)=>{
          console.log(err)
          })
      },
    // 查询--全部
      search(){
          this.getData()
      },
      //   初始化数据-- 我的
      getData2(){
        this.params2.weizDateStart=this.star2+ ' 00:00:00'
        this.params2.weizDateEnd=this.end2+' 00:00:00'
        this.$axiosAjax.illegalGetAll(this.params2).then((res) => {
         if(res.data.success){
            this.resultlist2=res.data.result.items
            this.totalCount2= res.data.result.totalCount
          }
        }).catch((err)=>{
          console.log(err)
          })
      },
        // 查询-- 我的
      search2(){
          this.getData2()
      },
      // 单位树数据
      examinedUnits(){  
        this.$axiosAjax.examinedUnits({parentId:this.$store.state.departId}).then((res) => {
          if(res.data.success==true){
		    this.classValue=true;
            this.data=res.data.result;
          }
        }).catch(
          (err)=>{

          }
        )

      },
      goBack() {
      this.$bridge.callHandler({
              type: 'closePage',
              data: {}
            });
      }
    },
    watch:{
      "params.startTime":function(){
        // this.getData()
      },
    }
  }
</script>
<style lang="less" scoped>
.illegal{
    position: relative;
    .search{
        width: 100%;
        height: 70px;
        float: left;
        background-color: #fff;
        .searchBtn{
            width: 140px;
            height: 36px;
            line-height: 36px;
            margin: 20px auto;
            border-radius: 6px;
            background-color: #469b7a;
            color: #fff;
            text-align: center;
            font-size:14px;
            letter-spacing: 1px;
        }
    }
    .search-num{
        width: 100%;
        line-height: 40px;
        font-size: 14px;
        color: #469b7a;
        background: #d2cece;
        padding: 0 20px;
    }
    .form-item{
        .input_div{
            input{
                height: 18px;
                line-height: 18px;
            }
            .vux-x-icon{
                fill:#999;
                float: right;
                margin-top: 18px;
            }
        }
    }
    .top{
        li{
            width: 50%;
            float: left;
            height: 40px;
            line-height: 40px;
            text-align: center;
            background-color: #fff;
            border-bottom: 1px solid #d2cece;
        }
        .currentLi{
            background-color: #d2cece;
        }
    }
    .project_list{
        padding-left: 20px;
        li{
            border-bottom: 1px solid #efeff4;
            height: 100px;
            position: relative;
            padding-right: 10px;
            padding-top: 20px;
            img{
                width: 100%;
                height: 100%;
            }
            h4{
                width: 110px;
                display: -webkit-box;
                -webkit-line-clamp:2;
                -webkit-box-orient: vertical;
                overflow: hidden;
                font-size: 16px;
                height: 60px;
                float: left;
                line-height: 30px;
                margin: 0 6px;
            }
            .timeP{
                text-align: center;
                width: 80px;
                height: 60px;
                line-height: 60px;
                float: left;
                .rightSpan{
                    float: right;
                    width: 80px;
                    font-size: 14px;
                }
            }
            strong{
                height: 60px;
                line-height: 60px;
                width: 66px;
                float: left;
                text-align: center;
                font-size: 12px;
                color: #ff7333;
            }
            
            .vux-x-icon{
                fill:#999;
                right: 10px;
                top: 50%;
                margin-top: -11px;
                position: absolute;
            }
        }
    }
    .scroll-wrapper{
        overflow: auto;
    }
    .pink{
      background-color: pink;
    }
}

</style>
